<template>
  <div style="padding: 20px;">
    <h2 style="margin-bottom: 20px;">营业总收入-单季度详情</h2>
    <el-descriptions :column="2" border v-loading="loading">
      <el-descriptions-item label="股票代码">
        {{ stockDetail.stockCode || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="会计年度">
        {{ stockDetail.fiscalYear || '-' }}
      </el-descriptions-item>

      <el-descriptions-item label="一季度季末" :span="1">
        {{ stockDetail.q1End || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="一季度营业收入" :span="1">
        {{ formatNumber(stockDetail.q1Revenue) }}
      </el-descriptions-item>

      <el-descriptions-item label="二季度季末" :span="1">
        {{ stockDetail.q2End || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="二季度营业收入" :span="1">
        {{ formatNumber(stockDetail.q2Revenue) }}
      </el-descriptions-item>

      <el-descriptions-item label="三季度季末" :span="1">
        {{ stockDetail.q3End || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="三季度营业收入" :span="1">
        {{ formatNumber(stockDetail.q3Revenue) }}
      </el-descriptions-item>

      <el-descriptions-item label="四季度季末" :span="1">
        {{ stockDetail.q4End || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="四季度营业收入" :span="1">
        {{ formatNumber(stockDetail.q4Revenue) }}
      </el-descriptions-item>
    </el-descriptions>
    <div style="margin-top: 20px;">
      <el-button type="primary" @click="handleEdit">编辑</el-button>
      <el-button @click="handleBack">返回</el-button>
    </div>
  </div>
</template>

<script>
export default {
  name: 'StockRevenueQuarterView',
  data() {
    return {
      stockDetail: {
        id: '',
        stockCode: '',
        fiscalYear: null,
        q1End: '',
        q1Revenue: null,
        q2End: '',
        q2Revenue: null,
        q3End: '',
        q3Revenue: null,
        q4End: '',
        q4Revenue: null
      },
      loading: false
    }
  },
  created() {
    const id = this.$route.query.id;
    if (id) {
      this.loadDetail(id);
    } else {
      this.$message.warning('缺少ID参数');
      this.$router.push({ name: 'StockRevenueQuarter' });
    }
  },
  methods: {
    loadDetail(id) {
      this.loading = true;
      this.request.get("/stockRevenueQuarter/" + id).then(res => {
        this.loading = false;
        if (res.code === 200) {
          this.stockDetail = res.data;
        }
      }).catch(() => {
        this.loading = false;
        this.$message.error('加载数据失败');
      });
    },
    handleEdit() {
      this.$router.push({
        name: 'StockRevenueQuarterForm',
        query: { id: this.stockDetail.id }
      });
    },
    handleBack() {
      this.$router.push({ name: 'StockRevenueQuarter' });
    },
    // 格式化数字
    formatNumber(num) {
      if (!num && num !== 0) return '-';
      return num.toLocaleString('zh-CN', { maximumFractionDigits: 2 });
    }
  }
}
</script>

<style scoped>
</style>
